<script setup lang="ts">
import { ref, onMounted, watch } from 'vue'
import Header from '@/components/layout/Header.vue';
import Footer from '@/components/layout/Footer.vue';
import { FindAgreement } from "@/interfaces/sysconf";
import { findAgreement } from '@/apis/sysconf';
import router from '@/router';

const info = ref<FindAgreement>({
    id: '',
    textContent: '',
    languages: '',
    createTime: '',
    modifyTime: ''
})
const typeInfo = ref('')
watch(() => router.currentRoute.value.query.type, () => {
    const type = router.currentRoute.value.query.type as 'user' | 'privacy'
    typeInfo.value = type
    findAgreement({ type }).then(res => {
        info.value = res;
    })
}, { immediate: true })
</script>

<template>
    <div>
        <Header />
        <div class="px-[16px] sm:px-[24px]  max-w-[1248px]  mx-auto ">
            <div class="text-[32px] font-bold mt-[36px]">{{ typeInfo === 'user' ? '注册协议' : '隐私政策' }}</div>
            <div class="py-[12px]">最后更新日期：{{ info.modifyTime }}</div>
            <div v-html="info.textContent"></div>
        </div>
        <Footer />
    </div>
</template>
<style scoped></style>